import React from 'react';
import classNames from 'classnames';
import { Link } from 'react-router';

import {
  Button
} from 'react-bootstrap';

import DialogSign from './DialogSign';
import DialogSignLong from './DialogSignLong';
import DialogUnSign from './DialogUnSign';

import { product as ProductConfig} from '../config/Common';

class ProductBar extends React.Component {

  constructor() {
    super();

    this.state = {
       dialogVisiable : false
    };
  }

  static propTypes = {
      
  }

  static defaultProps = {
      
  }

  handleProductSign(product, event){
    this.setState({
      dialogVisiable : true,
    });

    event.preventDefault();
  }

  handleDialogHide(){
    this.setState({
       dialogVisiable : false
    });
  }

  render() {

    let { product, user, history, productAction} = this.props;

    let { status: productStatus, gstype: productType } = product;

    return (
        <div className="product-bar">
          {
           productStatus === ProductConfig.productStatus.hasSign?
             <Button bsStyle="default" block onClick={ this.handleProductSign.bind(this, product) }>
              已关注
            </Button>
            :
            <Button bsStyle="danger" block onClick={ this.handleProductSign.bind(this, product) }>
              +关注
            </Button>
          }
          
          { 
              productStatus === ProductConfig.productStatus.hasSign?
              <DialogUnSign 
                product = { product } 
                productAction = { productAction }
                user = { user }
                history = { history }
                visiable = { this.state.dialogVisiable } 
                onHide = { this.handleDialogHide.bind(this) }/>
              :
              productType === ProductConfig.productType.long?
              <DialogSignLong 
                product = { product }
                productAction = { productAction }
                user = { user }
                history = { history }
                visiable = { this.state.dialogVisiable } 
                onHide = { this.handleDialogHide.bind(this) }/>
              :
              <DialogSign
                product = { product }
                productAction = { productAction }
                user = { user }
                history = { history }
                visiable = { this.state.dialogVisiable } 
                onHide = { this.handleDialogHide.bind(this) }/>
           }  
        </div>
    );
  }
}

export default ProductBar;
